<template>
  <div class="morse-code-util">
    <h1>摩斯密码在线翻译</h1>
    <el-row :span="24">
      <el-col :span="12" :offset="6">
        <el-input
            v-model="textarea1"
            :autosize="{ minRows: 8 }"
            type="textarea"
            placeholder="请输入需要加密或解密的内容"
        />
        <div style="margin: 20px 0"/>
        <el-button round @click="encodeText">加密</el-button>
        <el-button round @click="decodeText">解密</el-button>
        <el-divider/>
        <div style="text-align: left;">
          <span>
            用摩斯密码表示"我爱你"<br/>
            英文：i love you 翻译成摩尔斯密码就是 .. .-.. --- ...- . -.-- --- ..-<br/>
            拼音：wo ai ni 翻译成摩尔斯密码就是 .-- --- .- .. -. ..<br/>
            ascii编码：25105 29233 20320 翻译成摩尔斯密码就是 ..--- ..... .---- ----- ..... ..--- ----. ..--- ...-- ...-- ..--- ----- ...-- ..--- -----<br/>
            GBK码：ced2 b0ae c4e3 翻译成摩尔斯密码就是 -.-. . -.. ..--- -... ----- .- . -.-. ....- . ...--<br/>
            <br/>
            国际求救信号SOS<br/>
            还有一个很重要的摩尔斯电码... --- ... 你一定要记住了，它是求救信号，通过远程表达方式：<br/>
            求救方式一：发出声响，三段三长三段(. . . _ _ _ . . .)莫尔斯电码。<br/>
            求救方式二：灯光，如手电，三段三长三段(开关灯)。<br/>
          </span>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import {decode, encode} from 'xmorse';

export default {
  name: "MorseCodeUtil",
  data() {
    return {
      textarea1: ''
    }
  },
  methods: {
    decodeText() {
      console.log('123')
      this.textarea1 = decode(this.textarea1)
    },
    encodeText() {
      console.log('456')
      this.textarea1 = encode(this.textarea1)
    }
  }
}
</script>

<style scoped>
.morse-code-util {
  text-align: center;
}
</style>
